<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ include file="../session.jsp"%>
<!DOCTYPE html>
<html lang="ko">
  <head>
  	<%@ include file="../head.jsp"%>
  	<script src="resources/js/jquery.js"></script>
	<script src="resources/js/bootstrap.min.js"></script>
	<!-- 형식검사 클래스 참조 -->
	<script src="resources/js/string.js"></script>
	<style>
  		.table > tbody > tr > td {
  			vertical-align:middle;
  		}
  		.input-group-addon {
  			background-color: #ffffff;
  			border: 0px;
  		}
  	</style>
  </head>
  <body>
  	<%@ include file="../menu.jsp"%>
	<div class="container">
		<div class="page-header clearfix">
			<h2 class="pull-left">경기결과등록</h2>
		</div>
			
		<span class="pull-left" style="margin-bottom:10px;">등록 : ${page.totalArticleCount}건</span>
		<div class="table-responsive">
			<table class="table table-striped table-hover">
				<thead>
					<tr class="warning row">
						<th class="text-center col-md-1">번호</th>
						<th class="text-center col-md-1">리그</th>
						<th class="text-center col-md-2">경기시간</th>
						<th class="text-center col-md-2.5">홈팀</th>
						<th class="text-center col-md-2.5">원정팀</th>
						<th class="text-center col-md-2">경기결과</th>
						<th class="text-center col-md-1">수정</th>
					</tr>
				</thead>
				<tbody>
					<c:forEach items="${list}" var="item">
						<form id="updateResult${item.idGame}" method="get" action="resultGameOk">
							<input type="hidden" name="page" value="${page.nowPage}" />
							<input type="hidden" name="idGame" value="${item.idGame}" />
							<tr class="row">
								<td class="col-md-1 text-center">${item.idGame}</td>
								<td class="col-md-1 text-center">${item.idLeagueValue}</td>
								<td class="col-md-2 text-center">
									<fmt:parseDate value="${item.gameDate.substring(0, 12)}" var="dateFmt" pattern="yyyyMMddHHmm"/>
	                                <fmt:formatDate value="${dateFmt}" pattern="yyyy-MM-dd HH:mm"/>
								</td>
								<td class="col-md-2.5 text-center"><a href="viewTeam?id=${item.idHomeTeam}">${item.idHomeTeamValue}</a></td>
								<td class="col-md-2.5 text-center"><a href="viewTeam?id=${item.idAwayTeam}">${item.idAwayTeamValue}</a></td>
								<td class="col-md-2 text-center">
									<div id="scoreBox" class="col-md-12 input-group input-group-sm">
										<input type="number" class="form-control" name="homeScore${item.idGame}" />
										<span class="input-group-addon addon">:</span>
										<input type="number" class="form-control" name="awayScore${item.idGame}" />
									</div>
								</td>
								<td class="col-md-1 text-center">
									<button type="submit" class="btn btn-warning">수정</button>
								</td>
							</tr>
							
							<script type="text/javascript">
								$("#updateResult${item.idGame}").submit(function() {
									
									if (!$("input[name='homeScore${item.idGame}']").val().isValue()) {
										alert("홈팀 점수를 숫자로만 입력하세요.");
										$("input[name='homeScore${item.idGame}']").focus();
										return false;
									}
									
									if (!$("input[name='homeScore${item.idGame}']").val().isNumber()) {
										alert("홈팀 점수는 숫자로만 입력이 가능합니다.");
										$("input[name='homeScore${item.idGame}']").focus();
										return false;
									}
									
									if (!$("input[name='awayScore${item.idGame}']").val().isValue()) {
										alert("원정팀 점수를 숫자로만 입력하세요.");
										$("input[name='awayScore${item.idGame}']").focus();
										return false;
									}
									
									if (!$("input[name='awayScore${item.idGame}']").val().isNumber()) {
										alert("원정팀 점수는 숫자로만 입력이 가능합니다.");
										$("input[name='awayScore${item.idGame}']").focus();
										return false;
									}
									
									if (!confirm("정말 수정하시겠습니까?")) {
										return false;
									}
								});
							</script>
						</form>
					</c:forEach>
				</tbody>
			</table>
		</div>
		
		<div class="text-center">
			<ul class="pagination">

				<!-- 이전 그룹 -->
				<c:choose>
					<c:when test="${page.startPage > page.pageGroupCount}">
						<li><a href="resultGame?page=${page.startPage-1}">&laquo;</a></li>
					</c:when>
					<c:otherwise>
						<li class="disabled"><a href="#">&laquo;</a></li>
					</c:otherwise>
				</c:choose>
				
				<!-- 페이지 번호 -->
				<c:forEach begin="${page.startPage}" end="${page.endPage}" step="1" var="now">
					<c:choose>
						<c:when test="${page.nowPage == now}">
							<li class="active"><a href="#">${now}</a></li>
						</c:when>
						<c:otherwise>
							<li><a href="resultGame?page=${now}">${now}</a></li>
						</c:otherwise>
					</c:choose>
				</c:forEach>

				<!-- 다음 그룹 -->
				<c:choose>
					<c:when test="${page.endPage < page.lastGroupFirstPage}">
						<li><a href="resultGame?page=${page.endPage+1}">&raquo;</a></li>
					</c:when>
					<c:otherwise>
						<li class="disabled"><a href="#">&raquo;</a></li>
					</c:otherwise>
				</c:choose>

			</ul>
		</div>

	</div>
  </body>
</html>